<template>
	<view class="body" :style="'background-color:' + diyContent.pageBackColor">
		<image v-if="diyContent.pageBackImg" class="diy-bg-img" :src="diyContent.pageBackImg" lazy-load />
		<block v-for="(config, index) in diyContent.component" :key="item.id">
			<!--图片-->
			<block v-if="config.type === 'image'">
				<view class="diy-module1 diy-image"
					:style="'background-color:'+config.backcolor+';display: flex;flex-direction: '+('right' == config.float ? 'row-reverse' : 'row')+';flex-wrap:wrap;'">
					<view
						:style="'width:'+(config.width*100)+'rpx;height:'+(config.height*100)+'rpx;margin-left:'+(config.marginLeft*100)+'rpx;margin-right:'+(config.marginRight*100)+'rpx;margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom*100)+'rpx;padding:'+(config.padding*100)+'rpx'"
						@tap.stop.prevent="doJump" :data-url="image.link" :data-linktype="image.linktype" :data-linkid="image.linkid"
						v-for="(image,index) in config.data" :key="image.did">
						<image :src="util.attachedUrl(image.src,baseUrl)" :lazy-load="true"
							:style="'width:100%;height:100%;display:block;border-radius:'+(config.radius*100)+'rpx'">
						</image>
						<view v-if="'show_text' == config.showText"
							:style="'width:100%;text-align:center;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:'+(config.lineheight*100)+'rpx;color:'+(config.fontcolor)">
							{{image.text}}
						</view>
					</view>
				</view>
			</block>
			
			<!--音频-->
			<block v-if="config.type === 'audio'">
				<view class="diy-module1 diy-audio"
					:style="'display: block;box-sizing: content-box;padding-top: '+(config.paddingTop*100)+'rpx;padding-bottom: '+(config.paddingBottom*100)+'rpx;text-align:center'">
					<audio :src="util.attachedUrl(config.data[0].src,baseUrl)" :controls="true" style="text-align:left">
					</audio>
				</view>
			</block>
			
			<!--视频-->
			<block v-if="config.type === 'video'">
				<view class="diy-module1 diy-video"
					:style="'display: block;width:'+(config.width*100)+'rpx;height:'+(config.height*100)+'rpx;padding-left:'+(config.paddingLeft*100)+'rpx;padding-right:'+(config.paddingRight*100)+'rpx;padding-top:'+(config.paddingTop*100)+'rpx;padding-bottom:'+(config.paddingBottom*100)+'rpx'">
				</view>
			</block>
			
			<!--轮播-->
			<block v-if="config.type === 'slider'">
				<swiper class="diy-module1 diy-slider" :autoplay="true" interval="3000" :circular="true"
					:style="'width: '+(config.width*100)+'rpx;height:'+(config.height*100)+'rpx;margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom*100)+'rpx;margin-right: auto;margin-left: auto;'">
					<swiper-item @tap.stop.prevent="doJump" :data-url="item.link" :data-linktype="item.linktype" :data-linkid="item.linkid"
						v-for="(item,index) in (config.data)" :key="item.did">
						<image :src="util.attachedUrl(item.src,baseUrl)" :lazy-load="true"
							:style="'width: 750rpx;height:'+(config.height*100)+'rpx;'"></image>
					</swiper-item>
				</swiper>
			</block>
			
			<!--按钮-->
			<block v-if="config.type === 'button'">
				<view class="diy-module1 diy-button"
					:style="'display:flex;flex-direction: '+('right' == config.float ? 'row-reverse' : 'row')+';flex-wrap:wrap;background-color:'+(config.bgcolor)">
					<view :style="'text-align:center;padding:0;border:none;background-color:'+(config.btncolor)+';color:'+(config.fontcolor)+';width:'+(config.width*100)+'rpx;height:'+(config.height*100)+'rpx;line-height:'+(config.height*100)+'rpx;border-radius:'+(config.radius*100)+'rpx;font-size:'+(config.fontsize)+'px;margin-left:'+(config.marginLeft*100)+'rpx;margin-right:'+(config.marginRight*100)+'rpx;margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom*100)+'rpx;'"
						@tap.stop.prevent="doJump" :data-url="item.link" :data-linktype="item.linktype" :data-linkid="item.linkid"
						v-for="(item,index) in config.data" :key="item.did">{{item.text}}</view>
				</view>
			</block>
			
			<!--标题-->
			<block v-if="config.type === 'title'">
				<view class="diy-module1 diy-title"
					:style="'background-color:'+(config.bgcolor)+';margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom*100)+'rpx;padding: 20rpx;height: 100rpx;font-size: 16px;overflow: hidden;display:flex;justify-content:space-between;align-items:center;'"
					@tap.stop.prevent="doJump" :data-url="config.data[0].link" :data-linktype="config.data[0].linktype" :data-linkid="config.data[0].linkid">
					<image :src="util.attachedUrl(config.data[0].src,baseUrl)" :lazy-load="true" mode="aspectFill"
						style="height:60rpx;width:60rpx;"></image>
					<view :style="'color:'+(config.fontcolor)+';line-height:60rpx;flex-grow:1;padding-left:20rpx'">
						{{config.data[0].text}}
					</view>
					<text class="iconfont icon-iconfontyoujiantou" :style="'color:'+(config.fontcolor)"></text>
				</view>
			</block>
			
			<!--搜索-->
			<block v-if="config.type === 'search'">
				<view class="diy-module1 diy-search" :style="'background-color:'+(config.bgcolor)+';padding-left:'+(config.paddingLeft*100)+'rpx;padding-right:'+(config.paddingRight*100)+'rpx;padding-top:'+(config.paddingTop*100*baseSize)+'px;padding-bottom:'+(config.paddingBottom*100*baseSize)+'px;z-index:3;position:'+(config.position)+';'">
					<view class="diy-search-box">
						<icon type="search" size="30rpx" />
						<input class="diy-search-input" placeholder="请输入商品名称" placeholder-class="diy-placeholder" :disabled="true"
							@tap.stop.prevent="doSearch" />
					</view>
				</view>
			</block>
			
			<!--空白-->
			<block v-if="config.type === 'blank'">
				<view class="diy-module1 diy-blank" :style="'background-color:'+(config.bgcolor)+';height:'+(config.height*100)+'rpx'"></view>
			</block>
			
			<!--通告-->
			<block v-if="config.type === 'notice'">
				<view v-if="'type2'==config.csstype" class="diy-module1 diy-notice"
					:style="'background-color:'+(config.bgcolor)+';margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom*100)+'rpx;padding: 20rpx;'">
					<view
						style="height: 60rpx;font-size: 16px;overflow: hidden;display:flex;justify-content:space-between;align-items:center;">
						<image :src="util.attachedUrl(config.logo,baseUrl)" :lazy-load="true" style="height:60rpx;width:60rpx;">
						</image>
						<text
							:style="'height:60rpx;flex-grow:1;padding-left:20rpx;color:'+(config.fontcolor)+';line-height:60rpx;'">最新资讯</text>
						<text class="iconfont icon-iconfontyoujiantou" :style="'color:'+(config.fontcolor)"
							@tap.stop.prevent="doJump" :data-url="item.link" data-linktype="messageType" data-linkid="item.linkid"></text>
					</view>
					<view style="display: block;margin-top: 20rpx;border-top: 2rpx #ccc solid;">
						<view @tap.stop.prevent="doJump" :data-url="item.link" data-linktype="message" :data-linkid="item.did"
							style="border-bottom: 2rpx #ccc solid;padding: 20rpx 0;display: flex;"
							v-for="(item,index) in config.data" :key="item.did">
							<view style="padding-right: 20rpx;flex-grow: 1;">
								<view
									style="height: 100rpx;line-height: 50rpx;font-size: 28rpx;color: #666;overflow: hidden;white-space: normal;text-overflow: ellipsis;display: -webkit-box;word-break: break-all;-webkit-line-clamp: 2;-webkit-box-orient: vertical;">
									{{item.text}}
								</view>
								<view style="height: 50rpx;font-size: 20rpx;color: #888;line-height: 50rpx;">{{item.modifyTime}}
								</view>
							</view>
							<image :src="util.attachedUrl(item.image,baseUrl)"
								style="display: block;width: 250rpx;height: 150rpx;flex-shrink: 0;"></image>
						</view>
					</view>
				</view>
				<view v-else class="diy-module1 diy-notice"
					:style="'background-color:'+(config.bgcolor)+';margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom*100)+'rpx;padding: 20rpx;height: 100rpx;font-size: 16px;overflow: hidden;display:flex;justify-content:space-between;align-items:center;'">
					<image :src="util.attachedUrl('attached/image/diy/notice_layout1_logo.png',baseUrl)" :lazy-load="true" style="height:60rpx;width:60rpx;"></image>
					<swiper :autoplay="true" interval="3000" :circular="true" :vertical="true"
						style="height:60rpx;flex-grow:1;padding-left:20rpx">
						<swiper-item @tap.stop.prevent="doJump" :data-url="item.link2" data-linktype="message" :data-linkid="item.id"
							v-for="(item,index) in config.list" :key="item.did">
							<view :style="'color:'+(config.fontcolor)+';line-height:60rpx;'">{{item.messageTitle}}</view>
						</swiper-item>
					</swiper>
					<text class="iconfont icon-iconfontyoujiantou" :style="'color:'+(config.fontcolor)" @tap.stop.prevent="doJump"
						data-linktype="messageType" ></text>
				</view>
			</block>
			
			<!--客服-->
			<block v-if="config.type === 'custom'">
				<button class="diy-custom iconfont icon-kefu" open-type="contact" :show-message-card="true"
					:send-message-title="config.sendMessageTitle" :send-message-img="config.sendMessageImg"></button>
			</block>
			
			<!--电话-->
			<block v-if="config.type === 'phone'">
				<view class="diy-module1 diy-phone" @tap.stop.prevent="call" :data-phone-num="config.number"
					:style="'height:100rpx;padding:20rpx;display:flex;align-items:center;margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom)+'rpx;background-color:'+(config.bgcolor)+';'">
					<text class="iconfont icon-dianhua-shi" style="font-size:20px;height:20px"></text>
					<text
						:style="'flex-grow:1;font-size:16px;font-weight:bold;padding-left:20rpx;color:'+(config.fontcolor)">{{config.number}}</text>
					<text class="iconfont icon-iconfontyoujiantou" :style="'height:16px;color:'+(config.fontcolor)"></text>
				</view>
			</block>
			
			<!--地址-->
			<block v-if="config.type === 'address'">
				<view class="diy-module1 diy-address" @tap.stop.prevent="openMap" :data-latitude="config.latitude"
					:data-longitude="config.longitude"
					:style="'height:100rpx;padding:20rpx;display:flex;align-items:center;margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom)+'rpx;background-color:'+(config.bgcolor)+';'">
					<text class="iconfont icon-dingwei" style="font-size:20px;height:20px"></text>
					<text
						:style="'flex-grow:1;font-size:16px;font-weight:bold;padding-left:20rpx;color:'+(config.fontcolor)">{{config.address}}</text>
					<text class="iconfont icon-iconfontyoujiantou" :style="'height:16px;color:'+(config.fontcolor)"></text>
				</view>
			</block>
			
			<!--地图-->
			<block v-if="config.type === 'map'">
				<view class="diy-module1 diy-map"
					:style="'height:'+(config.height*100)+'rpx;width:'+(config.width*100)+'rpx;margin-top:'+(config.marginTop*100)+'rpx;margin-bottom:'+(config.marginBottom)+'rpx;margin-left:'+(config.marginLeft)+'rpx;margin-right:'+(config.marginRight)+'rpx;'">
					<map :longitude="config.longitude" :latitude="config.latitude" style="width:100%;height:100%;"
						:markers="[{id:1,latitude:config.latitude,longitude:config.longitude}]"></map>
				</view>
			</block>
			
			<!--商品列表-->
			<block v-if="config.type === 'goods-abandon'">
				<view :class="'diy-module1 diy-goods-box-'+(config.layout)" style="">
					<view :class="'diy-goods-'+(config.layout)" @tap.stop.prevent="doJump" :data-url="item.link" :data-linktype="item.linktype"
						:data-linkid="item.linkid"
						:style="('one'==layout||'four'==config.layout)?('width:'+710*config.baseSize+'px;margin:'+20*config.baseSize+'px;'):('two'==config.layout||'five'==config.layout)?('width:'+345*config.baseSize+'px;margin:0 0 '+20*config.baseSize+'px '+20*config.baseSize+'px'):('three'==config.layout||'six'==config.layout)?('width:'+710*config.baseSize+'px;margin:'+20*config.baseSize+'px;'):'none'"
						v-for="(item,index) in config.data" :key="item.did">
						<image :class="'diy-goods-img-'+(config.layout)" :src="util.attachedUrl(item.src,baseUrl)" :lazy-load="true">
						</image>
						<view :class="'diy-goods-name-'+(config.layout)">{{item.text}}</view>
						<view :class="'diy-goods-price-'+(config.layout)">¥{{item.price}}</view>
					</view>
				</view>
			</block>
			
			<!--自定义-->
			<block v-if="config.type === 'self'">
				<view class="diy-module1 diy-self"
					:style="'padding-left:'+(config.paddingLeft*100)+'rpx;padding-right:'+(config.paddingRight*100)+'rpx;padding-top:'+(config.paddingTop*100)+'rpx;padding-bottom:'+(config.paddingBottom*100)+'rpx;'"
					@tap.stop.prevent="doJump" :data-url="config.data[0].link" :data-linktype="config.data[0].linktype" :data-linkid="config.data[0].linkid">
					<rich-text :nodes="config.data[0].code"></rich-text>
				</view>
			</block>
			
			<!--布局3-->
			<block v-if="config.type === 'layout3'">
				<view class="diy-module1 diy-layout3" :style="'background-color:'+(config.backcolor)+';'">
					<image :src="util.attachedUrl(config.data[0].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay32'==config.layway?710:'lay33'==config.layway?710:'lay34'==config.layway?345:345)*baseSize)+'px;height:'+(345*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[0].link" :data-linktype="config.data[0].linktype" :data-linkid="config.data[0].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[1].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay32'==config.layway?345:'lay33'==config.layway?345:'lay34'==config.layway?345:345)*baseSize)+'px;height:'+(('lay32'==config.layway?162.5:'lay33'==config.layway?345:'lay34'==config.layway?345:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[1].link" :data-linktype="config.data[1].linktype" :data-linkid="config.data[1].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[2].src,config.baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay32'==config.layway?345:'lay33'==config.layway?345:'lay34'==config.layway?710:345)*baseSize)+'px;height:'+(('lay32'==config.layway?162.5:'lay33'==config.layway?345:'lay34'==config.layway?345:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[2].link" :data-linktype="config.data[2].linktype" :data-linkid="config.data[2].linkid">
					</image>
				</view>
			</block>
			
			<!--布局4-->
			<block v-if="config.type === 'layout4'">
				<view class="diy-module1 diy-layout4" :style="'background-color:'+(config.backcolor)+';'">
					<image :src="util.attachedUrl(config.data[0].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay42'==config.layway?345:'lay43'==config.layway?710:'lay44'==config.layway?710:345)*baseSize)+'px;height:'+(345*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[0].link" :data-linktype="config.data[0].linktype" :data-linkid="config.data[0].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[1].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay42'==config.layway?162.5:'lay43'==config.layway?162.5:'lay44'==config.layway?345:345)*baseSize)+'px;height:'+(('lay42'==config.layway?162.5:'lay43'==config.layway?162.5:'lay44'==config.layway?162.5:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[1].link" :data-linktype="config.data[1].linktype" :data-linkid="config.data[1].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[2].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay42'==config.layway?162.5:'lay43'==config.layway?162.5:'lay44'==config.layway?162.5:162.5)*baseSize)+'px;height:'+(('lay42'==config.layway?162.5:'lay43'==config.layway?162.5:'lay44'==config.layway?162.5:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[2].link" :data-linktype="config.data[2].linktype" :data-linkid="config.data[2].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[3].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay42'==config.layway?345:'lay43'==config.layway?345:'lay44'==config.layway?162.5:162.5)*baseSize)+'px;height:'+(('lay42'==config.layway?162.5:'lay43'==config.layway?162.5:'lay44'==config.layway?162.5:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[3].link" :data-linktype="config.data[3].linktype" :data-linkid="config.data[3].linkid">
					</image>
				</view>
			</block>
			
			<!--布局5-->
			<block v-if="config.type === 'layout5'">
				<view class="diy-module1 diy-layout5" :style="'background-color:'+(config.backcolor)+';'">
					<image :src="util.attachedUrl(config.data[0].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay52'==config.layway?710:'lay53'==config.layway?345:'lay54'==config.layway?345:345)*baseSize)+'px;height:'+(340*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[0].link" :data-linktype="config.data[0].linktype" :data-linkid="config.data[0].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[1].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?345:'lay54'==config.layway?345:162.5)*baseSize)+'px;height:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?345:'lay54'==config.layway?162.5:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[1].link" :data-linktype="config.data[1].linktype" :data-linkid="config.data[1].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[2].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?162.5:'lay54'==config.layway?345:162.5)*baseSize)+'px;height:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?162.5:'lay54'==config.layway?162.5:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[2].link" :data-linktype="config.data[2].linktype" :data-linkid="config.data[2].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[3].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?162.5:'lay54'==config.layway?345:162.5)*baseSize)+'px;height:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?162.5:'lay54'==config.layway?162.5:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[3].link" :data-linktype="config.data[3].dlinktype" :data-linkid="config.data[3].linkid">
					</image>
					<image :src="util.attachedUrl(config.data[4].src,baseUrl)" :lazy-load="true" class="diy-layout-img"
						:style="'margin-top:'+(20*baseSize)+'px;margin-left:'+(20*baseSize)+'px;width:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?345:'lay54'==config.layway?345:162.5)*baseSize)+'px;height:'+(('lay52'==config.layway?162.5:'lay53'==config.layway?162.5:'lay54'==config.layway?162.5:162.5)*baseSize)+'px;'"
						@tap.stop.prevent="doJump" :data-url="config.data[4].link" :data-linktype="config.data[4].linktype" :data-linkid="config.data[4].linkid">
					</image>
				</view>
			</block>
			
			<!--店招-->
			<block v-if="config.type === 'sign'">
				<view class="diy-module1 diy-sign" @tap.stop.prevent="doJump" :data-url="config.data[0].link" :data-linktype="config.data[0].linktype"
					:data-linkid="config.data[0].linkid">
					<image class="sign-bg-img" :src="util.attachedUrl(config.image,baseUrl)" :lazy-load="true" />
					<image class="sign-logo" :src="util.attachedUrl(config.data[0].src,baseUrl)" :lazy-load="true" />
					<view class="sign-name" :style="'color:'+(config.fontcolor)">{{config.data[0].text}}</view>
				</view>
			</block>
			
			<!--文本-->
			<block v-if="config.type === 'text'">
				<view class="diy-module1 diy-text" @tap.stop.prevent="doJump" :data-url="config.data[0].link" :data-linktype="config.data[0].linktype"
					:data-linkid="config.data[0].linkid"
					:style="'background-color:'+(config.bgcolor)+';color:'+(config.fontcolor)+';text-align:'+(config.textAlign)+';font-weight:'+(config.fontweight)+';font-size:'+(config.fontsize)+'px;padding:'+(config.paddingTop*100)+'rpx '+(config.paddingRight*100)+'rpx '+(config.paddingBottom*100)+'rpx '+(config.paddingLeft*100)+'rpx;'">
					<view class="text-content">{{config.data[0].text}}</view>
				</view>
			</block>
			
			<!--秒杀-->
			<block v-if="config.type === 'seckill'">
				<view class="diy-module1" v-if="config.data.length > 0">
					<view :class="'sub-title '+(config.displayType=='type2'?'type2':'type1')" 
						:style="'border-color:'+(config.color)">
						<view v-if="config.displayType=='type2'" class="sub-title-name"
							:style="'background-color:white; color:'+(config.color)+';'">
							限时秒杀</view>
						<view v-else class="sub-title-name" :style="'background-color:'+(config.color)+';color:white;'">限时秒杀</view>
						<view class="sub-title-triangle"
							:style="'border-color: '+(config.color)+' transparent transparent '+(config.color)">
						</view>
						<view class="sub-title-more" @tap.stop.prevent="doJump" :data-url="config.data[0].link" data-linktype="seckillList" data-linkid="">
							<text>查看更多</text>
							<text class="iconfont icon-iconfontyoujiantou"></text>
						</view>
					</view>
					<view :class="'diy-seckill diy-seckill-'+(config.style)" :style="'block' == config.display?'padding-top:0;':''">
						<view @tap.stop.prevent="doJump" :data-url="config.link" :data-linktype="config.type" :data-linkid="(item.did)+'-'+(item.goodsId)"
							:class="'seckill-item seckill-item-'+(config.style)" v-for="(item,index) in config.data"
							:key="item.did">
							<view :class="'seckill-img-box seckill-img-box-'+(config.style)"
								:style="'background-image: url('+util.attachedUrl(item.goodsImages,baseUrl)+')'">
								<view class="seckill-tips">秒杀</view>
								<view v-if="item.countdown&&item.countdown.length>0" class="seckill-countdown">
									<text>{{item.countdown[0]}}</text>
									<view v-if="item.countdown.length > 1" class="seckill-countdown-times">
										<text v-if="item.countdown[1] > 0"
											class="seckill-countdown-value num">{{item.countdown[1]}}</text>
										<text v-if="item.countdown[1] > 0">天</text>
										<text class="seckill-countdown-value num">{{item.countdown[2]}}</text>
										<text>:</text>
										<text class="seckill-countdown-value num">{{item.countdown[3]}}</text>
										<text>:</text>
										<text class="seckill-countdown-value num">{{item.countdown[4]}}</text>
									</view>
								</view>
							</view>
							<view class="seckill-goods-info">
								<text class="seckill-goods-name">{{item.goodsName}}</text>
								<text class="seckill-goods-sku">{{item.goodsSku}}</text>
								<text class="seckill-goods-rest">仅剩{{item.seckillStock}}件</text>
								<view class="seckill-goods-price num">
									<view class="seckill-goods-new-price">
										<block name="money">
											<view style="display:flex;align-items:baseline;line-height:1;" class="num">
												<text :style="'font-size:'+(30*0.7)+'rpx;'">¥ </text>
												<text :style="'font-size:'+(30)+'rpx;'">{{util.integerMoney(item.priceStr)}}</text>
												<text :style="'font-size:'+(30*0.7)+'rpx;'">{{util.decimalMoney(item.priceStr)}}</text>
											</view>
										</block>
									</view>
									<view class="seckill-goods-old-price">¥{{item.orgiPriceStr}}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</block>
			
			<!--优惠券-->
			<block v-if="config.type === 'coupon'">
				<view :class="'diy-module1 '+(config.style)+' '+(config.couponcolor)" v-if="config.data.length > 0">
					<view class="diy-coupon-box">
						<!-- @tap.stop.prevent="("1"==item.getFlag||item.couponRest<1)? ":' getCoupon"'" -->
						<view @tap.stop.prevent="getCoupon"
							:class="'coupon '+('1'==item.getFlag?'hasGet':item.couponRest<1?'hasOver':'')"
							:data-coupon-id="item.did" :data-item="item" v-for="(item,index) in config.data" :key="item.did">
							<view class="coupon-left">
								<text
									class="coupon-p1 num">{{"0"==item.discountType?(item.offMoney+"元"):"1"==item.discountType?(item.discount/10+"折"):""}}</text>
								<text class="coupon-p2 num">满{{item.fullMoney}}元可用</text>
								<text class="tip"
									v-if="'1'==item.getFlag||item.couponRest<1">{{"1"==item.getFlag?"已领取":"已领完"}}</text>
							</view>
							<view class="coupon-right">
								<text>{{"1"==item.getFlag?"已领取":item.couponRest<1?"已领完":"立即领取"}}</text>
							</view>
						</view>
					</view>
				</view>
			</block>
			
			<!--砍价-->
			<block v-if="config.type === 'bargain'">
				<view class="diy-module1" v-if="config.data.length > 0">
					<view :class="'sub-title '+(config.displayType=='type2'?'type2':'type1')" v-if="'block' == config.display"
						:style="'border-color:'+(config.color)">
						<view v-if="config.displayType=='type2'" class="sub-title-name"
							:style="'background-color:white; color:'+(config.color)+';'">
							疯狂砍价</view>
						<view v-else class="sub-title-name" :style="'background-color:'+(config.color)+'; color:white;'">疯狂砍价</view>
						<view class="sub-title-triangle"
							:style="'border-color: '+(config.color)+' transparent transparent '+(config.color)">
						</view>
						<view class="sub-title-more" @tap.stop.prevent="doJump" data-url="" data-linktype="bargainList" data-linkid="">
							<text>查看更多</text>
							<text class="iconfont icon-iconfontyoujiantou"></text>
						</view>
					</view>
					<view :class="'diy-bargain diy-bargain-'+(config.style)" :style="'block' == config.display?'padding-top:0;':''">
						<view @tap.stop.prevent="doJump" :data-url="item.link" data-linktype="bargain" :data-linkid="item.did"
							:class="'bargain-item bargain-item-'+(config.style)" v-for="(item,index) in config.data"
							:key="item.did">
							<view :class="'bargain-img-box bargain-img-box-'+(config.style)"
								:style="'background-image: url('+(util.attachedUrl(item.image,baseUrl))+')'">
								<view class="bargain-tips">砍价</view>
								<view class="bargain-countdown">
									<text>{{item.countdown[0]}}</text>
									<view v-if="item.countdown.length > 1" class="bargain-countdown-times">
										<text v-if="item.countdown[1] > 0"
											class="bargain-countdown-value num">{{item.countdown[1]}}</text>
										<text v-if="item.countdown[1] > 0">天</text>
										<text class="bargain-countdown-value num">{{item.countdown[2]}}</text>
										<text>:</text>
										<text class="bargain-countdown-value num">{{item.countdown[3]}}</text>
										<text>:</text>
										<text class="bargain-countdown-value num">{{item.countdown[4]}}</text>
									</view>
								</view>
							</view>
							<view class="bargain-goods-info">
								<text class="bargain-goods-name">{{item.goodsName}}</text>
								<text class="bargain-goods-sku">{{util.clearSpec(item.caseName)}}</text>
								<text class="bargain-goods-rest">仅剩{{item.goodsRest}}件</text>
								<view class="bargain-goods-price num">
									<view class="bargain-goods-new-price">
										<block name="money">
											<view style="display:flex;align-items:baseline;line-height:1;" class="num">
												<text :style="'font-size:'+(30*0.7)+'rpx;'">¥ </text>
												<text
													:style="'font-size:'+(30)+'rpx;'">{{util.integerMoney(item.minPrice)}}</text>
												<text
													:style="'font-size:'+(30*0.7)+'rpx;'">{{util.decimalMoney(item.minPrice)}}</text>
											</view>
										</block>
									</view>
									<view class="bargain-goods-old-price">¥{{item.originalPrice}}</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</block>
			
			<!--拼团-->
			<block v-if="config.type === 'collage'">
				<view class="diy-module1" v-if="config.data.length > 0">
					<view :class="'sub-title '+(config.displayType=='type2'?'type2':'type1')" v-if="'block' == config.display"
						:style="'border-color:'+(config.color)">
						<view v-if="config.displayType=='type2'" class="sub-title-name"
							:style="'background-color:white; color:'+(config.color)+';'">
							开心拼团</view>
						<view v-else class="sub-title-name" :style="'background-color:'+(config.color)+'; color:white;'">开心拼团</view>
						<view class="sub-title-triangle"
							:style="'border-color: '+(config.color)+' transparent transparent '+(config.color)">
						</view>
						<view class="sub-title-more" @tap.stop.prevent="doJump"  data-url="" data-linktype="collageList" data-linkid="">
							<text>查看更多</text>
							<text class="iconfont icon-iconfontyoujiantou"></text>
						</view>
					</view>
					<view :class="'diy-collage diy-collage-'+(config.style)" :style="'block' == config.display?'padding-top:0;':''">
						<view @tap.stop.prevent="doJump" :data-url="item.link" data-linktype="collage" :data-linkid="(item.did)+'-'+(item.goodsId)"
							:class="'collage-item collage-item-'+(config.style)" v-for="(item,index) in config.data"
							:key="item.did">
							<view :class="'collage-img-box collage-img-box-'+(config.style)"
								:style="'background-image: url('+(util.attachedUrl(item.goodsImages,baseUrl))+')'">
								<view class="collage-tips">拼团</view>
								<view v-if="item.countdown&&item.countdown.length>0" class="collage-countdown">
									<text>{{item.countdown[0]}}</text>
									<view v-if="item.countdown.length > 1" class="collage-countdown-times">
										<text v-if="item.countdown[1] > 0"
											class="collage-countdown-value num">{{item.countdown[1]}}</text>
										<text v-if="item.countdown[1] > 0">天</text>
										<text class="collage-countdown-value num">{{item.countdown[2]}}</text>
										<text>:</text>
										<text class="collage-countdown-value num">{{item.countdown[3]}}</text>
										<text>:</text>
										<text class="collage-countdown-value num">{{item.countdown[4]}}</text>
									</view>
								</view>
							</view>
							<view class="collage-goods-info">
								<text class="collage-goods-name">【{{item.personNum}}人团】{{item.goodsName}}</text>
								<text
									class="collage-rule">成团条件：{{item.periodSize}}{{"0"==item.periodName?"分钟":"1"==item.periodName?"小时":"2"==item.periodName?"天":"3"==item.periodName?"个月":""}}内，{{item.personNum}}人购买并完成支付</text>
								<view class="collage-goods-old-price num">原价：¥{{item.goodsMinMaxPrice}}</view>
								<view class="collage-goods-new-price num">
									<text>拼团价：</text>
									<block name="money">
										<view style="display:flex;align-items:baseline;line-height:1;" class="num">
											<text :style="'font-size:'+(30*0.7)+'rpx;'">¥ </text>
											<text :style="'font-size:'+(30)+'rpx;'">{{util.integerMoney(item.groupPrice)}}</text>
											<text :style="'font-size:'+(30*0.7)+'rpx;'">{{util.decimalMoney(item.groupPrice)}}</text>
										</view>
									</block>
								</view>
							</view>
						</view>
					</view>
				</view>
			</block>
			
			<!--直播-->
			<block v-if="config.type === 'liveBroadCast'">
				<view class="diy-module1" v-if="config.data.length > 0">
					<view :class="'sub-title '+(config.displayType=='type2'?'type2':'type1')" v-if="'block' == config.display"
						:style="'border-color:'+(config.color)">
						<view v-if="config.displayType=='type2'" class="sub-title-name"
							:style="'background-color:white; color:'+(config.color)+';'">
							直播活动</view>
						<view v-else class="sub-title-name" :style="'background-color:'+(config.color)+';color:white;'">直播活动</view>
						<view class="sub-title-triangle" :style="'border-color: '+(config.color)+' transparent transparent '+(config.color)">
						</view>
						<view class="sub-title-more" @tap.stop.prevent="doJump" :data-url="config.data[0].link" data-linktype="liveBroadCastList" data-linkid="">
							<text>查看更多</text>
							<text class="iconfont icon-iconfontyoujiantou"></text>
						</view>
					</view>
					<view :class="'diy-liveBroadCast diy-liveBroadCast-'+(config.style)" :style="'block' == config.display?'padding-top:0;':''">
						<view @tap.stop.prevent="doJump" :data-url="item.link" data-linktype="liveBroadCast" :data-linkid="item.did"
							:class="'liveBroadCast-item liveBroadCast-item-'+(config.style)" v-for="(item,index) in config.data"
							:key="item.did">
							<view
								:class="'liveBroadCast-img-box liveBroadCast-img-box-'+(config.style)+' '+((item.live_status==101 || item.live_status==102 || item.live_status==105 || item.live_status== 106)?'':'disable')"
								:style="'background-image: url('+(util.attachedUrl(item.share_img,baseUrl))+')'">
								<view class="liveBroadCast-tips"
									v-if="item.live_status==101 || item.live_status==105 || item.live_status== 106 || item.live_status== 102">
									直播</view>
								<view class="liveBroadCast-countdown"
									v-if="item.live_status==101 || item.live_status==105 || item.live_status== 106">
									正在直播
								</view>
								<view class="liveBroadCast-countdown" v-else-if="item.live_status==102">
									{{item.start_time_string}}开播
								</view>
								<view class="liveBroadCast-countdown-disable" v-else>
									直播已结束
								</view>
							</view>
							<view class="liveBroadCast-goods-info">
								<text class="liveBroadCast-goods-name">{{item.name}}</text>
							</view>
						</view>
					</view>
				</view>
			</block>
			
			<!--商品列表-->
			<block v-if="config.type === 'goods'">
				<view class="diy-module1" v-if="config.data.length > 0">
					<view :class="'diy-goods diy-goods-'+(config.style)">
						<view @tap.stop.prevent="doJump" :data-url="config.link" :data-linktype="config.type" :data-linkid="item.did"
							:class="'goods-item goods-item-'+(config.style)" v-for="(item,index) in config.data" :key="item.did">
							<view :class="'goods-img-box-'+(config.style)">
								<image class="goods-img" :src="util.attachedUrl(item.goodsImages,baseUrl)"></image>
							</view>
							<view class="goods-info-box">
								<view class="goods-name">{{item.goodsName}}</view>
								<view class="goods-price" v-if="item.hasDisPrice">
									<!-- parse <template is="money" :data="money:item.disPrice,fontSize:34"></template> -->
									<block name="money">
										<view style="display:flex;align-items:baseline;line-height:1;" class="num">
											<text :style="'font-size:'+(30*0.7)+'rpx;'">¥ </text>
											<text :style="'font-size:'+(30)+'rpx;'">{{util.integerMoney(item.disPrice)}}</text>
											<text :style="'font-size:'+(30*0.7)+'rpx;'">{{util.decimalMoney(item.disPrice)}}</text>
										</view>
									</block>
									<text class="tag"
										:style="'color:'+(platformConfig.baseColor)+';border:1px solid '+(platformConfig.baseColor)">限时折扣</text>
								</view>
								<view class="goods-price" v-else>
									<block name="money">
										<view style="display:flex;align-items:baseline;line-height:1;" class="num">
											<text :style="'font-size:'+(30*0.7)+'rpx;'">¥ </text>
											<text :style="'font-size:'+(30)+'rpx;'">{{util.integerMoney(item.goodsMinPrice)}}</text>
											<text :style="'font-size:'+(30*0.7)+'rpx;'">{{util.decimalMoney(item.goodsMinPrice)}}</text>
										</view>
									</block>
								</view>
								<view class="goods-other">
									<text class="goods-price-old"
										v-if="(!util.isEmpty(item.goodsRetailPrice) && !util.isEqual(item.goodsRetailPrice,item.goodsMinPrice))">{{"¥"
				        + util.money(item.goodsRetailPrice)}}</text>
									<text
										class="goods-sale">{{util.praseInt(item.goodsSale) + util.praseInt(item.goodsSaleSpecial)}}人付款</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</block>

		</block>
	</view>
</template>

<script module="util" lang="wxs" src="../../utils/util.wxs"></script>
<script>
	const app = getApp();

	let util = require('../../utils/util.js');

	let jump = require('../../utils/jump'); // let livePlayer = requirePlugin('live-player-plugin');
	import {
		http
	} from '@/utils/commonRequest.js'; // 局部引入
	export default {
		data() {
			return {
				baseUrl: app.globalData.baseurl,
				baseSize: 0.5,
				//1prx=0.5px
				diyContent: null,
				seckillComponentIndex: [],
				bargainComponentIndex: [],
				collageComponentIndex: [],
				liveBroadCastComponentIndex: [],
				intervals: [],
				//视频上下文对象，用于控制同时只能播放一个视频
				videoContexts: {},
				component: {
					id: ''
				}
			};
		},

		/**
		 * 组件的属性列表
		 */
		props: {
			diyContentRaw: {
				type: Object,
				default: null
			},
			diyPageId: {
				type: String,
				default: null
			},
			//diy页面类型,1平台页面，2商户页面，用于diy页面跳转到另一个diy页面，
			//平台diy页面只能跳转到平台diy页面，商户diy页面只能跳转到商户diy页面
			diyPageType: {
				type: String,
				default: '1'
			},
			diyMerchantId: {
				type: String,
				default: ''
			}
		},

		watch: {
			diyContentRaw: {
				handler: function() {
					this.clearIntervals();
					this.seckillComponentIndex = [];
					this.bargainComponentIndex = [];
					this.collageComponentIndex = [];
					this.liveBroadCastComponentIndex = [];
					this.videoContexts = {};
					this.handleData(this.diyContentRaw);
				},

				immediate: true,
				deep: true
			}
		},

		beforeMount: function() {
			if (!util.isEmpty(app.globalData.sysInfo.screenWidth)) {
				this.baseSize = app.globalData.sysInfo.screenWidth / 750;
			}
		},

		destroyed: function() {
			// 在组件实例被从页面节点树移除时执行
			console.log('==========================================');
			this.clearIntervals();
		},


		onShow: function() {
			// 页面被展示时
			console.log('-----------------------------------------------');

			for (let i = 0, len = this.seckillComponentIndex.length; i < len; i++) {
				this.seckillCountdown(this.seckillComponentIndex[i]);
			}

			for (let i = 0, len = this.bargainComponentIndex.length; i < len; i++) {
				this.bargainCountdown(this.bargainComponentIndex[i]);
			}

			for (let i = 0, len = this.collageComponentIndex.length; i < len; i++) {
				this.collageCountdown(this.collageComponentIndex[i]);
			}

			for (let i = 0, len = this.liveBroadCastComponentIndex.length; i < len; i++) {
				this.queryLiveBroadCastStatus(this.liveBroadCastComponentIndex[i]);
			}
		},

		onHide: function() {
			//页面被隐藏时，关闭定时器，减少不必要的消耗
			this.clearIntervals();
		},

		/**
		 * 组件的方法列表
		 */
		methods: {
			//页面跳转
			doJump: function(e) {
				console.log(e);
				let type = e.currentTarget.dataset.linktype;
				let id = e.currentTarget.dataset.linkid || "";
				let url = e.currentTarget.dataset.url || "";
				if (util.isEmpty(type)) {
					return;
				}
				console.log("1:" ,type, "2:", id,"3:",this.diyPageType, "4:",this.diyPageId,"5:", url)
				jump.doJump(type, id, this.diyPageType, this.diyPageId, url);
			},
			videoErr: function(err) {
				console.log('videoErr');
				console.log(err);
			},
			handleData: function(diyContentRaw) {
				let diyContent = diyContentRaw;
				console.log(diyContent);
				let haveSeckill = false;
				let haveCoupon = false;
				let haveBargain = false;
				let haveCollage = false;
				let haveGoods = false;
				let haveNotice = false;
				let haveVideo = false;
				let haveLiveBroadCast = false;
				for (let i = 0; i < diyContent.component.length; i++) {
					if (null == diyContent.component[i]) {
						continue;
					}

					if ('self' == diyContent.component[i].type && diyContent.component[i].data.length > 0) {
						diyContent.component[i].data[0].code = util.base64Decode(diyContent.component[i].data[0].code);
						diyContent.component[i].data[0].code = diyContent.component[i].data[0].code.replace(
							/attached\/image/g, this.baseUrl + '/attached/image');
						diyContent.component[i].data[0].code = diyContent.component[i].data[0].code.replace(/\<img/g,
							"<img class='imgItem'");
					} else if ('custom' == diyContent.component[i].type) {
						if (!util.isEmpty(diyContent.shareTitle)) {
							diyContent.component[i].sendMessageTitle = diyContent.shareTitle;
						} else {
							diyContent.component[i].sendMessageTitle = diyContent.pageTitle;
						}

						if (!util.isEmpty(diyContent.shareImage)) {
							diyContent.component[i].sendMessageImg = this.baseUrl + '/' + diyContent.shareImage;
						} else {
							diyContent.component[i].sendMessageImg = '';
						}
					} else if ('seckill' == diyContent.component[i].type) {
						haveSeckill = true;
					} else if ('coupon' == diyContent.component[i].type) {
						haveCoupon = true;
					} else if ('bargain' == diyContent.component[i].type) {
						haveBargain = true;
					} else if ('collage' == diyContent.component[i].type) {
						haveCollage = true;
					} else if ('goods' == diyContent.component[i].type) {
						haveGoods = true;
					} else if ('notice' == diyContent.component[i].type) {
						haveNotice = true;
					} else if ('video' == diyContent.component[i].type) {
						haveVideo = true;
					} else if ('liveBroadCast' == diyContent.component[i].type) {
						haveLiveBroadCast = true;
					}
				}

				if (!util.isEmpty(diyContent.pageTitle)) {
					uni.setNavigationBarTitle({
						title: diyContent.pageTitle
					});
				}

				if (!util.isEmpty(diyContent.titleFontColor)) {
					uni.setNavigationBarColor({
						frontColor: '#ffffff' == diyContent.titleFontColor ? '#ffffff' : '#000000',
						backgroundColor: diyContent.titleBackColor
					});
				}

				this.diyContent = diyContent
				// this.diyContentRaw = null

				console.log(this.diyContent, 'this.diyContent')
				if (haveSeckill) {
					this.seckill();
				}

				if (haveCoupon) {
					this.coupon();
				}

				if (haveBargain) {
					this.bargain();
				}

				if (haveCollage) {
					this.collage();
				}

				if (haveGoods) {
					this.goods();
				}

				if (haveNotice) {
					this.notice();
				}

				if (haveVideo) {
					//this.video();
				}

				if (haveLiveBroadCast) {
					this.liveBroadCast();
				}
			},
			//电话
			call: function(event) {
				uni.makePhoneCall({
					phoneNumber: event.currentTarget.dataset.phoneNum
				});
			},
			//打开地图
			openMap: function(event) {
				uni.openLocation({
					latitude: Number.parseFloat(event.currentTarget.dataset.latitude),
					longitude: Number.parseFloat(event.currentTarget.dataset.longitude)
				});
			},
			//搜索
			doSearch: function(e) {
				console.log(e);

				if (this.diyPageType == '2' && !util.isEmpty(this.diyMerchantId)) {
					uni.navigateTo({
						url: '/subPackages/mall/pages/goodsList/goodsList?merchantId=' + this.diyMerchantId
					});
				} else {
					uni.navigateTo({
						url: '/subPackages/mall/pages/goodsList/goodsList'
					});
				}
			},

			/**
			 * 秒杀
			 */
			seckill: function() {
				let component = this.diyContent.component;

				for (let i = 0, len = component.length; i < len; i++) {
					if ('seckill' == component[i].type) {
						if ('auto' == component[i].addtion) {
							//自动获取秒杀商品
							this.getSeckillGoods(i);
						} else {
							//倒计时
							this.seckillComponentIndex.push(i);
							this.seckillCountdown(i);
						}
					}
				}
			},
			getSeckillGoods: function(componentIndex) {
				let that = this;
				http.get('/diy/getSeckillListByPageId', {
						params: {
							pageId: this.diyPageId
						}
					})
					.then((res) => {
						res = res.data
						if (200 == res.code) {
							let seckillGoodsList = res.list;
							let validSeckillGoodsIndex = 0;
							let len = seckillGoodsList.length;
							let count = parseInt(that.diyContent.component[componentIndex].count);

							for (let i = 0; i < len && validSeckillGoodsIndex < count; i++) {
								if ('1' == seckillGoodsList[i].state || '2' == seckillGoodsList[i].state) {
									let componentData = {
										did: seckillGoodsList[i].id,
										endTime: seckillGoodsList[i].endTime,
										goodsId: seckillGoodsList[i].goodsId,
										goodsImages: seckillGoodsList[i].goodsImages,
										goodsName: seckillGoodsList[i].goodsName,
										goodsSku: seckillGoodsList[i].goodsSku,
										orgiPriceStr: seckillGoodsList[i].orgiPriceStr,
										priceStr: seckillGoodsList[i].priceStr,
										seckillStock: seckillGoodsList[i].seckillStock,
										startTime: seckillGoodsList[i].startTime,
										state: seckillGoodsList[i].state
									};
									this.$set(this.diyContent.component[componentIndex].data, validSeckillGoodsIndex, componentData)
									validSeckillGoodsIndex++;
								}
							}

							if (validSeckillGoodsIndex > 0) {
								that.seckillComponentIndex.push(componentIndex);
								that.seckillCountdown(componentIndex);
							}
						}
					})
					.catch((err) => {
						console.log(err);
					});
			},
			seckillCountdown: function(componentIndex) {
				let that = this;
				let interval = setInterval(function() {
					let now = new Date();
					let seckillComponentData = that.diyContent.component[componentIndex].data;
					let allEnd = true;
					let countdownsTips = {};

					for (let i = 0, len = seckillComponentData.length; i < len; i++) {
						let countDownTips = [];

						if (now.getTime() < seckillComponentData[i].startTime) {
							let times = parseInt((seckillComponentData[i].startTime - now.getTime()) / 1000);
							countDownTips = that.countTime(times);
							countDownTips.unshift('距开始');
							allEnd = false;
						} else if (now.getTime() < seckillComponentData[i].endTime) {
							let times = parseInt((seckillComponentData[i].endTime - now.getTime()) / 1000);
							countDownTips = that.countTime(times);
							countDownTips.unshift('距结束');
							allEnd = false;
						} else {
							countDownTips = ['秒杀已结束！'];
						}

						let obj = that.diyContent.component
						that.diyContent.component[componentIndex].data.splice(i, 1, Object.assign(that
							.diyContent.component[componentIndex].data[i], {
								countdown: countDownTips
							}))
					}
					// that.countdownsTips = countdownsTips
					// console.log("seckillCountdown-" + componentIndex);

					if (allEnd) {

						clearInterval(interval);
					}
				}, 1000);
				console.log(interval, 11111111111)
				this.intervals.push(interval);
			},
			queryLiveBroadCastStatus: function(componentIndex) {
				let that = this;
				let liveBroadCastComponentData = that.diyContent.component[componentIndex].data;
				let allEnd = true;
				let statusTips = {};
				let roomIds = '';

				for (let i = 0; i < liveBroadCastComponentData.length; i++) {
					roomIds = roomIds + liveBroadCastComponentData[i].roomid + '' + '-'; // 房间 id
				} //去后台查询直播间状态

				http.get('/liveBroadCast/getLiveBroadCastListStatu', {
						params: {
							roomIds: roomIds
						}
					})
					.then((res) => {
						res = res.data
						if (200 == res.code) {
							let liveBroadCastList = res.liveBroadCastList;

							for (let i = 0; i < liveBroadCastList; i++) {
								status = liveBroadCastList[i].liveStatus;

								if (status == '101' || status == '102' || status == '105' || status == '106') {
									allEnd = false;
								}
							}
							statusTips['diyContent.component[' + componentIndex + '].data'] = liveBroadCastList;
							that.statusTips = statusTips
						}
					})
					.catch((err) => {
						console.log(err);
					});

				if (allEnd) {
					clearInterval(interval);
				} else {
					let interval = setInterval(function() {
						let liveBroadCastComponentData = that.diyContent.component[componentIndex].data;
						let allEnd = true;
						let statusTips = {};
						let roomIds = '';

						for (let i = 0; i < liveBroadCastComponentData.length; i++) {
							roomId = roomIds + liveBroadCastComponentData[i].roomid + '' + '-'; // 房间 id
						} //去后台查询直播间状态

						http.get('/liveBroadCast/getLiveBroadCastListStatu', {
								params: {
									roomIds: roomIds
								}
							})
							.then((res) => {
								res = res.data
								if (200 == res.code) {
									let liveBroadCastList = res.liveBroadCastList;
									console.log(liveBroadCastList);

									for (let i = 0; i < liveBroadCastList; i++) {
										status = liveBroadCastList[i].liveStatus;

										if (status == '101' || status == '102' || status == '105' ||
											status == '106') {
											allEnd = false;
										}
									}

									statusTips['diyContent.component[' + componentIndex + '].data'] =
										liveBroadCastList;
									that.statusTips = statusTips
									console.log(that.diyContent.component[componentIndex].data);
								}
							})
							.catch((err) => {
								console.log(err);
							});

						if (allEnd) {
							clearInterval(interval);
						}
					}, 120000);
					this.intervals.push(interval);
				}
			},

			/**
			 * 优惠券
			 */
			coupon: function() {
				let component = this.diyContent.component;

				for (let i = 0, len = component.length; i < len; i++) {
					if ('coupon' == component[i].type) {
						if ('auto' == component[i].addtion) {
							//自动优惠券
							this.getCoupons(i);
						} else {}
					}
				}
			},
			getCoupons: function(componentIndex) {
				let that = this;
				let count = parseInt(that.diyContent.component[componentIndex].count);
				http.get('/diy/getCouponListByPageId', {
						params: {
							pageId: this.diyPageId,
							pageSize: count
						}
					})
					.then((res) => {
						res = res.data
						if (200 == res.code) {
							let couponList = res.list;
							let validCouponIndex = 0;
							let len = couponList.length;

							for (let i = 0; i < len && validCouponIndex < count; i++) {
								let endTime = couponList[i].endTime;

								if (util.isEmpty(endTime)) {
									endTime = '3019-01-01';
								}

								let now = util.formatDate(new Date());

								if (now <= endTime) {
									let componentData = {
										did: couponList[i].id,
										discountType: couponList[i].discountType,
										discount: couponList[i].discount,
										offMoney: couponList[i].offMoney,
										fullMoney: couponList[i].fullMoney,
										getFlag: couponList[i].getFlag,
										couponRest: couponList[i].couponRest,
										endTime: endTime
									};
									this.$set(this.diyContent.component[componentIndex].data, validCouponIndex, componentData)
									validCouponIndex++;
								}
							}
						}
					})
					.catch((err) => {
						console.log(err);
					});
			},
			getCoupon: function(e) {
				let couponId = e.currentTarget.dataset.couponId;
				let that = this;
				uni.showLoading({
					title: '领取中',
					mask: true
				});
				this.$checkAuth()
					.then((res) => {
						// app.get("/diy/getCoupon", {
						//   couponid: couponId
						// }).then(res => {
						//   wx.hideLoading();
						//   if (200 == res.code) {
						//     if ('SUCCESS' == res.msg) {
						//       wx.showToast({
						//         title: '领取成功'
						//       })
						//     } else if ('ALREADY_GET' == res.msg) {
						//       util.message("已经领取过该优惠券，不能重复领取！");
						//     } else if ('NO_COUPONS' == res.msg) {
						//       util.message("很抱歉，您来晚啦！优惠券已经被抢光了！");
						//     }
						//   } else {
						//     util.message("领取失败，请稍后再试");
						//   }
						// }).catch(err => {
						//   console.log(err);
						//   wx.hideLoading();
						// });
						//先根据优惠券id查询该优惠券基本信息
						http.get('/shopcoupons/detail', {
								params: {
									couponId: couponId
								}
							})
							.then((res1) => {
								res1 = res1.data
								if (200 == res1.code) {
									let cardFlag = res1.cardFlag;

									if ('0' == cardFlag) {
										app.globalData
											.post('shop/getCoupon', {
												couponid: couponId
											})
											.then((res2) => {
												uni.hideLoading();
												res2 = res2.data
												if (200 == res2.code) {
													if (res2.msg == 'SUCCESS') {
														uni.showToast({
															title: '领取成功'
														});
													} else if (res2.msg == 'ALREADY_GET') {
														uni.showToast({
															title: '您已经领取过该优惠券',
															icon: 'none'
														});
													} else if (res2.msg == 'NO_COUPONS') {
														uni.showToast({
															title: '很抱歉，该优惠券已领罄',
															icon: 'none'
														});
													} else if (res2.msg == 'NO_EFFLIMIT_TIMES') {
														uni.showToast({
															title: '很抱歉，领券次数用完！',
															icon: 'none'
														});
													} else if (res2.msg == 'NO_PERLIMIT_TIMES') {
														uni.showToast({
															title: '很抱歉，周期内领取次数已达上限！',
															icon: 'none'
														});
													}
												} else {
													util.message('领取失败，请稍后再试');
												}
											});
									} else if ('1' == cardFlag) {
										//先调用微信接口获取微信随机分配的code（先判断该用户是否领过卡券），用户领取成功后再更新我们系统的券码
										http.get('shop/hasCoupon', {
												params: {
													couponId: couponId
												}
											})
											.then((res3) => {
												uni.hideLoading();
												res3 = res3.data
												let flag = res3.flag;

												if (util.isEmpty(flag)) {
													uni.showToast({
														title: '参数异常',
														icon: 'none',
														duration: 2000
													});
													return;
												}

												if ('1' == flag) {
													uni.showToast({
														title: '已经领取过该优惠券，不能重复领取',
														icon: 'none',
														duration: 2000
													});
													return;
												} else if ('0' == flag) {
													//调用微信卡券接口获取导入的一张code,先获取签名参数
													http.get('member/getCouponParam', {
															params: {
																couponId: couponId
															}
														})
														.then((res4) => {
															res4 = res4.data
															let code = res4.code;

															if (200 !== code) {
																util.tips('获取微信参数异常！');
																return;
															} else {
																uni.addCard({
																	cardList: [{
																		cardId: res4.cardId,
																		cardExt: '{"outer_str":"miniProgram","timestamp":"' + res4.timestamp + '","nonce_str":"' +
																			res4.nonceStr + '","signature":"' + res4.signature + '"}'
																	}],
																	// 需要添加的卡券列表
																	success: function(res5) {
																		let cardList = res5.cardList;
																		console.log('cardList-----' + cardList);
																		let obj = cardList[0];
																		console.log('obj-----' + obj);
																		let encryptCode = obj.code;
																		console.log('encryptCode-----' + encryptCode);
																		let cardId = obj.cardId;
																		console.log('cardId-----' + cardId); //通过获取的code从我们数据库中找出对应的code并更新用户信息

																		http.post('shop/getCouponNew', {
																					couponid: couponId,
																					encryptCode: encryptCode,
																					cardId: cardId
																				})
																			.then((res6) => {
																				res = res6.data
																				if (200 == res6.code) {
																					if (res6.msg == 'SUCCESS') {
																						uni.showToast({
																							title: '领取成功'
																						});
																					} else if (res6.msg == 'ALREADY_GET') {
																						uni.showToast({
																							title: '领取成功'
																						});
																					} else if (res6.msg == 'NO_COUPONS') {
																						uni.showToast({
																							title: '很抱歉，该优惠券已领罄',
																							icon: 'none'
																						});
																					} else if (res6.msg == 'NO_EFFLIMIT_TIMES') {
																						uni.showToast({
																							title: '很抱歉，该优惠券已领完',
																							icon: 'none'
																						});
																					} else if (res6.msg == 'NO_PERLIMIT_TIMES') {
																						uni.showToast({
																							title: '很抱歉，周期内领取已达上限',
																							icon: 'none'
																						});
																					}
																				}
																			});
																	}
																});
															}
														});
												}
											});
									} else {
										uni.hideLoading();
										util.message('数据异常');
									}
								} else {
									uni.hideLoading();
									util.message(res1.msg);
								}
							});
					})
					.catch((err) => {
						uni.hideLoading();
						console.log(err);
					});
			},

			/**
			 * 砍价
			 */
			bargain: function() {
				let component = this.diyContent.component;

				for (let i = 0, len = component.length; i < len; i++) {
					if ('bargain' == component[i].type) {
						if ('auto' == component[i].addtion) {
							//自动获取砍价商品
							this.getBargainGoods(i);
						} else {
							//倒计时
							this.bargainComponentIndex.push(i);
							this.bargainCountdown(i);
						}
					}
				}
			},
			getBargainGoods: function(componentIndex) {
				let that = this;
				let count = parseInt(that.diyContent.component[componentIndex].count);
				console.log(this.diyPageId, count);
				http.get('/diy/getBargainListByPageId', {
						params: {
							pageId: this.diyPageId,
							pageSize: count
						}
					})
					.then((res) => {
						console.log(res);
						res = res.data
						if (200 == res.code) {
							console.log(res);
							let bargainGoodsList = res.list;
							let validBargainGoodsIndex = 0;
							let len = bargainGoodsList.length;

							for (let i = 0; i < len && validBargainGoodsIndex < count; i++) {
								if ('1' == bargainGoodsList[i].status) {
									let componentData = {
										did: bargainGoodsList[i].id,
										endTime: bargainGoodsList[i].endTime,
										goodsId: bargainGoodsList[i].goodsId,
										image: bargainGoodsList[i].image,
										goodsName: bargainGoodsList[i].goodsName,
										caseName: bargainGoodsList[i].caseName,
										originalPrice: bargainGoodsList[i].originalPrice,
										minPrice: bargainGoodsList[i].minPrice,
										goodsRest: bargainGoodsList[i].goodsRest,
										startTime: bargainGoodsList[i].startTime,
										status: bargainGoodsList[i].status
									};
									this.$set(this.diyContent.component[componentIndex].data, validBargainGoodsIndex, componentData)	
									validBargainGoodsIndex++;
								}
							}

							if (validBargainGoodsIndex > 0) {
								that.bargainComponentIndex.push(componentIndex);
								that.bargainCountdown(componentIndex);
							}
						}
					})
					.catch((err) => {
						console.log(err);
					});
			},
			bargainCountdown: function(componentIndex) {
				let that = this;
				let interval1 = setInterval(function() {
					let now = new Date();
					let bargainComponentData = that.diyContent.component[componentIndex].data;
					let allEnd = true;
					let countdownsTips = {};

					for (let i = 0, len = bargainComponentData.length; i < len; i++) {
						let countDownTips = '';

						if (now.getTime() < bargainComponentData[i].startTime) {
							let times = parseInt((bargainComponentData[i].startTime - now.getTime()) / 1000);
							countDownTips = that.countTime(times);
							countDownTips.unshift('距开始');
							allEnd = false;
						} else if (now.getTime() < bargainComponentData[i].endTime) {
							let times = parseInt((bargainComponentData[i].endTime - now.getTime()) / 1000);
							countDownTips = that.countTime(times);
							countDownTips.unshift('距结束');
							allEnd = false;
						} else {
							countDownTips = ['砍价已结束！'];
						}

						let arr = that.diyContent.component
						that.diyContent.component[componentIndex].data.splice(i, 1, Object.assign(that
							.diyContent.component[componentIndex].data[i], {
								countdown: countDownTips
							}))
					}
					// console.log("bargainCountdown-" + componentIndex);
					that.countdownsTips = countdownsTips
					if (allEnd) {
						clearInterval(interval1);
					}
				}, 1000);
				console.log(interval1, 22222222222)
				this.intervals.push(interval1);
			},

			/**
			 * 拼团
			 */
			collage: function() {
				let component = this.diyContent.component;

				for (let i = 0, len = component.length; i < len; i++) {
					if ('collage' == component[i].type) {
						if ('auto' == component[i].addtion) {
							//自动获取拼团商品
							this.getCollageGoods(i);
						} else {
							//倒计时
							this.collageComponentIndex.push(i);
							this.collageCountdown(i);
						}
					}
				}
			},

			/**
			 * 直播
			 */
			liveBroadCast: function() {
				let component = this.diyContent.component;

				for (let i = 0, len = component.length; i < len; i++) {
					if ('liveBroadCast' == component[i].type) {
						if ('auto' == component[i].addtion) {
							//自动获取直播列表
							this.getLiveBroadCasts(i);
						} else {
							this.liveBroadCastComponentIndex.push(i);
							this.queryLiveBroadCastStatus(i);
						}
					}
				}
			},
			getLiveBroadCasts: function(componentIndex) {
				let that = this;
				let count = parseInt(that.diyContent.component[componentIndex].count);
				http.get('/diy/getLiveBroadCastListByPageId', {
						params: {
							pageId: this.diyPageId,
							pageSize: count
						}
					})
					.then((res) => {
						res = res.data
						if (200 == res.code) {
							let liveBroadCastList = res.list;
							let validLiveBroadCastIndex = 0;
							let len = liveBroadCastList.length;

							for (let i = 0; i < len && validLiveBroadCastIndex < count; i++) {
								let componentData = {
									did: liveBroadCastList[i].roomid,
									roomid: liveBroadCastList[i].roomid,
									name: liveBroadCastList[i].name,
									cover_img: liveBroadCastList[i].cover_img,
									goods: liveBroadCastList[i].goods,
									live_status: liveBroadCastList[i].live_status,
									live_status_name: liveBroadCastList[i].live_status_name,
									start_time: liveBroadCastList[i].start_time,
									end_time: liveBroadCastList[i].end_time,
									anchor_name: liveBroadCastList[i].anchor_name,
									share_img: liveBroadCastList[i].share_img
								};
								this.$set(this.diyContent.component[componentIndex].data, validLiveBroadCastIndex, componentData)
								validLiveBroadCastIndex++;
							}

							if (validLiveBroadCastIndex > 0) {
								that.liveBroadCastComponentIndex.push(componentIndex);
								that.queryLiveBroadCastStatus(componentIndex);
							}
						}
					})
					.catch((err) => {
						console.log(err);
					});
			},
			getCollageGoods: function(componentIndex) {
				let that = this;
				let count = parseInt(that.diyContent.component[componentIndex].count);
				http.get('/diy/getCollageListByPageId', {
						params: {
							pageId: this.diyPageId,
							pageSize: count
						}
					})
					.then((res) => {
						res = res.data
						if (200 == res.code) {
							let collageGoodsList = res.list;
							let validCollageGoodsIndex = 0;
							let len = collageGoodsList.length;
							let count = parseInt(that.diyContent.component[componentIndex].count);

							for (let i = 0; i < len && validCollageGoodsIndex < count; i++) {
								if ('1' == collageGoodsList[i].status || '2' == collageGoodsList[i].status) {
									let componentData = {
										did: collageGoodsList[i].id,
										endTime: collageGoodsList[i].endTime,
										goodsId: collageGoodsList[i].goodsId,
										goodsImages: collageGoodsList[i].goodsImages,
										goodsName: collageGoodsList[i].goodsName,
										groupPrice: collageGoodsList[i].groupPrice,
										goodsMinMaxPrice: collageGoodsList[i].goodsMinMaxPrice,
										personNum: collageGoodsList[i].personNum,
										periodSize: collageGoodsList[i].periodSize,
										periodName: collageGoodsList[i].periodName,
										startTime: collageGoodsList[i].startTime,
										status: collageGoodsList[i].status
									};
									this.$set(this.diyContent.component[componentIndex].data, validCollageGoodsIndex, componentData)
									validCollageGoodsIndex++;
								}
							}

							if (validCollageGoodsIndex > 0) {
								that.collageComponentIndex.push(componentIndex);
								that.collageCountdown(componentIndex);
							}
						}
					})
					.catch((err) => {
						console.log(err);
					});
			},
			collageCountdown: function(componentIndex) {

				let that = this;
				let interval2 = setInterval(function() {
					let now = new Date();
					let collageComponentData = that.diyContent.component[componentIndex].data;
					let allEnd = true;
					let countdownsTips = {};

					for (let i = 0, len = collageComponentData.length; i < len; i++) {
						let countDownTips = '';

						if (now.getTime() < collageComponentData[i].startTime) {
							let times = parseInt((collageComponentData[i].startTime - now.getTime()) / 1000);
							countDownTips = that.countTime(times);
							countDownTips.unshift('距开始');
							allEnd = false;
						} else if (now.getTime() < collageComponentData[i].endTime) {
							let times = parseInt((collageComponentData[i].endTime - now.getTime()) / 1000);
							countDownTips = that.countTime(times);
							countDownTips.unshift('距结束');
							allEnd = false;
						} else {
							countDownTips = ['拼团已结束！'];
						}

						// that.diyContent.component[componentIndex].data[i].countdown = countDownTips;
						let arr = that.diyContent.component
						that.diyContent.component[componentIndex].data.splice(i, 1, Object.assign(that
							.diyContent.component[componentIndex].data[i], {
								countdown: countDownTips
							}))
					}
					// console.log("collageCountdown-" + componentIndex);
					// that.countdownsTips = countdownsTips
					// console.log(that.countdownsTips,'that.countdownsTips')
					if (allEnd) {
						clearInterval(interval2);
					}
				}, 1000);
				this.intervals.push(interval2);
			},

			/**
			 * 商品列表
			 */
			goods: function() {
				let component = this.diyContent.component;

				for (let i = 0, len = component.length; i < len; i++) {
					if ('goods' == component[i].type) {
						if ('auto' == component[i].addtion) {
							//自动获取商品
							this.getGoods(i);
						} else {}
					}
				}
			},
			getGoods: function(componentIndex) {
				let that = this;
				let count = parseInt(that.diyContent.component[componentIndex].count);
				http.get('/diy/getGoodsListByPageId', {
						params: {
							pageId: this.diyPageId,
							pageSize: count
						}
					})
					.then((res) => {
						res = res.data
						if (200 == res.code) {
							let goodsList = res.list;
							let validGoodsIndex = 0;
							let len = goodsList.length;

							for (let i = 0; i < len && validGoodsIndex < count; i++) {
								let componentData = {
									did: goodsList[i].id,
									goodsImages: goodsList[i].goodsImages,
									goodsName: goodsList[i].goodsName,
									goodsRetailPrice: goodsList[i].goodsRetailPrice,
									goodsMinPrice: goodsList[i].goodsMinPrice,
									checkStatus: goodsList[i].checkStatus,
									goodsMinMaxPrice: goodsList[i].goodsMinMaxPrice,
									goodsSale: goodsList[i].goodsSale,
									goodsSaleSpecial: goodsList[i].goodsSaleSpecial,
									hasDisPrice: goodsList[i].hasDisPrice,
									disPrice: goodsList[i].disPrice,
									status: goodsList[i].status
								};
								this.$set(this.diyContent.component[componentIndex].data, validGoodsIndex, componentData)
								validGoodsIndex++;
							}
						}
					})
					.catch((err) => {
						console.log(err);
					});
			},

			/**
			 * 资讯
			 */
			notice: function() {
				let component = this.diyContent.component;

				for (let i = 0, componentLen = component.length; i < componentLen; i++) {
					if ('notice' == component[i].type) {
						this.getNotice(i);
					}
				}
			},
			getNotice: function(componentIndex) {
				let that = this;
				let count = parseInt(that.diyContent.component[componentIndex].count);
				http.get('/diy/getNoticeListByPageId', {
						params: {
							pageId: this.diyPageId,
							typeId: this.diyContent.component[componentIndex].typeId,
							pageSize: count
						}
					})
					.then((res) => {
						res = res.data
						if (200 == res.code) {
							let noticeList = res.list;
							let len = noticeList.length;

							for (let j = 0; j < len; j++) {
								let componentData = {
									did: noticeList[j].id,
									text: noticeList[j].messageTitle,
									modifyTime: noticeList[j].modifyTime,
									image: noticeList[j].image
								};
								that.diyContent.component[componentIndex].data[j] = componentData;
							}
						}

						console.log(this.diyContent.component);
					})
					.catch((err) => {
						console.log(err);
					});
			},

			/**
			 * 视频
			 */
			video: function() {
				let component = this.diyContent.component;
				let videoId;

				for (let i = 0, componentLen = component.length; i < componentLen; i++) {
					if ('video' == component[i].type) {
						videoId = 'video-' + component[i].data[0].did;
						this.videoContexts[videoId] = uni.createVideoContext(videoId, this);
					}
				}

				console.log(this.videoContexts);
			},
			videoPlay: function(e) {
				let videoId = e.currentTarget.dataset.id; //暂停其它视频

				for (let key in this.videoContexts) {
					if (videoId != key) {
						this.videoContexts[key].pause();
					}
				}
			},
			countTime: function(times) {
				let day = 0;
				let hour = 0;
				let minute = 0;
				let second = 0; //时间默认值
				if (times > 0) {
					day = Math.floor(times / 60 / 60 / 24);
					hour = Math.floor((times - day * 24 * 60 * 60) / 60 / 60);
					minute = Math.floor((times - day * 24 * 60 * 60 - hour * 60 * 60) / 60);
					second = times - day * 24 * 60 * 60 - hour * 60 * 60 - minute * 60;
				}

				if (hour <= 9) {
					hour = '0' + hour;
				}

				if (minute <= 9) {
					minute = '0' + minute;
				}

				if (second <= 9) {
					second = '0' + second;
				}

				return [day, hour, minute, second];
			},
			clearIntervals: function() {
				for (let i = 0, len = this.intervals.length; i < len; i++) {
					clearInterval(this.intervals[i]);
				}

				this.intervals = [];
			}
		}
	};
</script>
<style>
	@import '@/templates/templates.css';

	.body {
		position: relative;
		padding: 0;
	}
	.diy-bg-img {
		position: absolute;
		width: 100%;
		height: 100%;
	}
</style>
